<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">     
		<meta content="yes" name="apple-mobile-web-app-capable">     
		<meta content="black" name="apple-mobile-web-app-status-bar-style">     
		<meta content="telephone=no" name="format-detection">
		<link rel="stylesheet" href="../../css/mui.min.css">
		<link rel="stylesheet" href="../../css/ui.min.css">
		<link rel="stylesheet" href="../../css/shop.css">
		<link rel="stylesheet" href="../../css/iconfont.css">
		<title>今日收益</title>
	</head>
	<style>
		*{
			margin:0px;
			padding:0px;
			list-style:none;
			font-size:0.9rem;
		}
		.x_box{
			width:100%;
		}
		.h_gl{
			width:90%;
			margin:0 auto;
			padding:10px;
			color:#666;
		}
		.h_xs{
			width:90%;
			height:auto;
			background:white;
			margin:0 auto;
			padding:10px 10px 1.5rem 10px;
			display: flex;
			flex-wrap:wrap;
			justify-content:space-around;
			box-shadow:2px 2px 10px #ccc;
		}
		.h_xs li div{
			text-align:center;
		}
		.h_xs li div:nth-of-type(2){
			line-height: 2rem;
		}
		.h_xs li{
			width:33.3%;
			margin-top:1rem;
		}
		.boss-box{
			position: relative;
			top: 3.8rem;
			margin-bottom: 1.3rem;
		}
	</style>
	<body>
		<header class="ui-header">
		     <a href="javascript:history.go(-1)" class="mui-action-back ui-icon hd-left">
		        <span class="iconfont icon-fanhui"></span>
		    </a>
		    <div class="ui-title">今日收益</div>
		</header>
		<div class="boss-box" id="app">
			<div class="h_box">
				<div class="h_gl">后台管理</div>
				<ul class="h_xs">
					<li>
						<div>退换货申请</div>
						<div>0</div>
					</li>
					<li>
						<div>待发货订单</div>
						<div>{{order.daifahuo}}</div>
					</li>
					<li>
						<div>未确认订单</div>
						<div>0</div>
					</li>
					<li>
						<div>待支付订单</div>
						<div>{{order.weifukuan}}</div>
					</li>
					<li>
						<div>已成交订单数</div>
						<div>{{order.yiwancheng}}</div>
					</li>
					<li>
						<div>商品总数</div>
						<div>{{goods.goods_num}}</div>
					</li>
				</ul>
			</div>
			<div class="h_box">
				<div class="h_gl">今日营销概况</div>
				<ul class="h_xs">
					<li>
						<div>新增会员总数</div>
						<div>{{users.user_j_num}}</div>
					</li>
					<li>
						<div>今日总成交额</div>
						<div>{{order.jinri_sum}}</div>
					</li>
				</ul>
			</div>
			<div class="h_box">
				<div class="h_gl">昨日营销概况</div>
				<ul class="h_xs">
					<li>
						<div>昨日会员总数</div>
						<div>{{users.user_z_num}}</div>
					</li>
					<li>
						<div>昨日总成交额</div>
						<div>{{order.zuori_sum}}</div>
					</li>
				</ul>
			</div>
			<div class="h_box">
				<div class="h_gl">整体营销概况</div>
				<ul class="h_xs">
					<li>
						<div>会员总数</div>
						<div>{{users.user_zong_num}}</div>
					</li>
					<li>
						<div>总成交额</div>
						<div>{{order.zong_sum}}</div>
					</li>
				</ul>
			</div>
		</div>
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/vue.min.js"></script>
		<script src="../../js/common/config.js"></script>
		<script>
			var vm = new Vue({
				el: "#app",
				data: {
					goods : {},
					order : {},
					users : {},
				},
				methods: {
					init(){
						this.getData();
					},
					getData(){
						var _that = this;
						mui.ajax(Config.api.Baos_tongji, {
							data: {
								request_type: 1,
								user_id: 106,
							},
							type: 'post',
							dataType: 'json',
							success: function(data) {
								console.log(data);
								_that.goods = data.goods;
								_that.order = data.order;
								_that.users = data.users;
							},
							error: function(xhr, type, errorThrown) {
								console.log("接口错误");
							},
						});
					}
				}
			});
			vm.init();
		</script>
	</body>
</html>
